<template>
	<view>
		<uni-popup ref="popup" type="bottom" @change="popChange">
			<view class="tip-view">
				<text class="tip-title">请选择头像</text>
				<view v-if="dataSource==1" class="man-view">
					<image class="img" @click="itemClick"  data-index="1" src="http://c.shiqin.wang/photo/nanyi.png"></image>
					<image class="img" style="margin-left: 44rpx;" @click="itemClick" data-index="2"
					src="http://c.shiqin.wang/photo/naner.png"></image>
					<image class="img" style="margin-left: 44rpx;" @click="itemClick" data-index="3"
					src="http://c.shiqin.wang/photo/nansan.png"></image>
					<image class="img" style="margin-left: 44rpx;" @click="itemClick" data-index="0"
					src="http://c.shiqin.wang/photo/jia.png"></image>
				</view>
				<view v-else class="woman-view">
					<image class="img" @click="itemClick" data-index="1"src="http://c.shiqin.wang/photo/nvyi.png"></image>
					<image class="img" style="margin-left: 44rpx;" @click="itemClick" data-index="2"
					src="http://c.shiqin.wang/photo/nver.png"></image>
					<image class="img" style="margin-left: 44rpx;" @click="itemClick" data-index="3"
					src="http://c.shiqin.wang/photo/nvsan.png"></image>
					<image class="img" style="margin-left: 44rpx;" @click="itemClick" data-index="0"
					src="http://c.shiqin.wang/photo/jia.png"></image>
				</view>
				<image class="close-img" @click="itemClick" data-index="-1"
				src="http://c.shiqin.wang/photo/cha.png"></image>
			</view>
		</uni-popup>
	</view>
</template>

<script>
	export default {
		name: "head-choose-pop",
		props: {
			isShow: false,
			dataSource: Number,
		},
		watch: {
			isShow(val) {
				if (val) {
					this.$refs.popup.open();
				}
			}
		},
		data() {
			return {};
		},
		methods: {
			popChange(e) {
				if (!e.show) {
					var obj = {
						isclose: false,
					};
					this.$emit('returnHeadChoose', obj);
				}
			},
			itemClick(e) {
				var index=parseInt(e.currentTarget.dataset.index)
				var obj = {
					isclose: false,
					position:index
				};
				switch(index){
					case 0:
						obj.tag="select"
						break
					case 1:
						obj.tag="select"
						break
					case 2:
						obj.tag="select"
						break
					case 3:
						obj.tag="select"
						break
				}
				this.$emit('returnHeadChoose', obj);
				this.$refs.popup.close();
			},
		}
	}
</script>

<style>
	@import "head-choose-pop.css";
</style>
